        *{
            margin: 0;
            padding: 0;
            list-style: none;
        }
        /*css 初始化*/
        /* 声明字体*/
        @font-face {
          font-family: electronicFont;
          src: url("font/DS-DIGIT.TTF");
        }
        /* body背景*/
        body {
            display: flex;
            flex-direction: column;
            width: 100vw;
            height: 100vh;
            /* 背景图 */
            background: url("images/bg.jpg") repeat top center;
            background-size: cover;
            /* 背景颜色 */
            /*background-color: #2c343c;*/
            /* body设置多出的内容隐藏掉：在自适应窗口拖动时，会溢出一些东西 */
            overflow: hidden;
        }
        /* body的子元素布局 */
        /* 标题和主体盒子开启flex */
        .flex-layout {
            display: flex;
            justify-content: center;
        }
        .mainbox {
            flex: 9;
            padding: 0.1vh 0.1vh 0;
        }
        /*  头部背景图片和大小  */
        header {
            position: relative;
            background: url("images/head_bg.png") no-repeat top center;
            background-size: 100% 100%;
        }
        /* 标题和时间的高度，行高7vh, 字体大小3vh, 颜色白色*/
        .h1_time {
            height: 7vh;
            font-size: 3vh;
            line-height: 7vh;
            color: #fff;
        }
        /* 时间定位到左边距离77vw远 字体大小2vh 灰色*/
        .showTime {
            position: absolute;
            left: 77vw;
            font-size: 2vh;
            color: rgba(255, 255, 255, 0.7);
            overflow: hidden;
        }
            /* select的盒子 */
            .market{
                color: #b0e6f0;
                position: absolute;
                top: 1vh;
                left: 7vw;
                line-height: 5vh;
                font-size: 2vh;
                foground-color: #ffffff;
                colont-family: "Droid Serif", "DejaVu Serif", "STIX", serif;
            }
            /* select的样式 */
            #marketName{
                backr: #000;
                opacity: .9;
                padding: 0.016vh;
                border-radius: 0.02vh;
                border: 0.024rem solid #fff;
                width: 7vw;
                height: 3vh;
                font-size: 0.2rem;
                font-family: "宋体";
            }
        /* 主体 */
        .column {
            /* 因为echarts自适应宽度必须是百分比，所以不能用flex*/
            /*flex: 3;*/
            width: 30%;
            display: flex;
            flex-direction: column;
        }
        .column2 {
            /*flex: 5;*/
            margin: 0.1vh .15vh;
            width: 40%;
        }
        .panel {
            position: relative;
            display: flex;
            flex-direction: column;
            flex: 1;
            border: 1px solid rgba(25, 186, 139, 0.17);
            background: url("images/line(1).png");
            padding: 0 0.15vh 0.5vh;
            margin-bottom: 0.15vh;
        }
        .panel:before {
            position: absolute;
            top: 0;
            left: 0;
            content: "";
            width: 10px;
            height: 10px;
            border-top: 2px solid #02a6b5;
            border-left: 2px solid #02a6b5;
        }
        .panel:after {
            position: absolute;
            top: 0;
            right: 0;
            content: "";
            width: 10px;
            height: 10px;
            border-top: 2px solid #02a6b5;
            border-right: 2px solid #02a6b5;
        }
        .panel-footer {
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
        }
        .panel-footer:before {
            position: absolute;
            bottom: 0;
            left: 0;
            content: "";
            width: 10px;
            height: 10px;
            border-bottom: 2px solid #02a6b5;
            border-left: 2px solid #02a6b5;
        }
        .panel-footer:after {
            position: absolute;
            bottom: 0;
            right: 0;
            content: "";
            width: 10px;
            height: 10px;
            border-bottom: 2px solid #02a6b5;
            border-right: 2px solid #02a6b5;
        }
        .panel > h2 {
            flex:1;
            /*height: 5vh;*/
            /*line-height: 5vh;*/
            text-align: center;
            color: #fff;
            font-size: 2vh;
            font-weight: 400;
        }
        .domz {
            flex:15;
            display: flex;
            flex-direction: row;
            /*height: 80%;*/
            /*height: 24.8vh;*/
        }
        .panel > .chart {
            flex:15;
            /*height: 80%;*/
            /*height: 24.8vh;*/
        }
        .chart1 {/*height: 80%;*/
            flex:1;
            /*height: 24.8vh;*/
        }
        .chart2 {/*height: 80%;*/
            flex:1;
            /* 在两个图之间放一根竖线做间隔 */
            border-left: 0.5vh solid #02a6b5;
            /*height: 24.8vh;*/
        }
        /* 箱线图1的占比 */
        .boxplot1 {
            flex: 2;
        }
        /* 中间列布局-数字文本部分 */
        /* 数字文本部分占中间列的1份，地图map占8份 */
        .no {
            flex: 1;
            background: rgba(101, 132, 226, 0.1);
        }
        /* 数字部分的开启绝对定位，设置左上角和右下角的角标 */
        .no-hd {
            position: relative;
            border: 1px solid rgba(25, 186, 139, 0.17);
        }
        .no-hd:before {
            content: "";
            position: absolute;
            width: 30px;
            height: 10px;
            border-top: 2px solid #02a6b5;
            border-left: 2px solid #02a6b5;
            top: 0;
            left: 0;
        }
        .no-hd:after {
            content: "";
            position: absolute;
            width: 30px;
            height: 10px;
            border-bottom: 2px solid #02a6b5;
            border-right: 2px solid #02a6b5;
            bottom: 0;
            right: 0;
        }
        /* 设置ul flex，其成员每个li用空格间隔 */
        .no ul {
            display: flex;
            justify-content: space-around;
        }
        /* 数字li */
        .no-hd li {
            position: relative;
            line-height: 5vh;
            text-align: center;
            font-size: 2vw;
            color: #ffeb7b;
            padding: 0.05vh 0;
            font-family: electronicFont;
            font-weight: bold;
        }
        /* li 之间用小竖线隔开 */
        .no-hd li:first-child::after {
            content: "";
            position: absolute;
            height: 50%;
            width: 1px;
            background: rgba(255, 255, 255, 0.2);
            right: 0;
            top: 25%;
        }
        /* 文本li */
        .no-bd li {
            text-align: center;
            font-size: 2vh;
            line-height: 5vh;
            color: rgba(255, 255, 255, 0.7);
            padding-top: 0.125vh;
        }
        /* 地图 */
        .map {
            position: relative;
            flex: 8;
        }
        /* map图表占div的100% */
        .map .chart {
            height: 100%;
        }
        /* 切换 */
        .mapA {
            position: absolute;
            left: 80%;
            top: 3.5vh;
            color: #fff;
            text-decoration: underline;
            font-size: 0.1875vh;
            /* 设置为第一层，不然链接点不到 */
            z-index: 1;
        }
        .mapA:nth-child(1) {
            left: 75%;
        }